<template>
  <div class="center_bottom">
    <div class="video"></div>
    <div class="video"></div>
    <div class="video"></div>
    <div class="video"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
    };
  },
  props: {},
  mounted() {
  },
  methods: {

  },
};
</script>
<style lang="scss" scoped>
.center_bottom {
  width: 100%;
  height: 100%;
  display: flex;

  .video {
    width: 80%;
    margin: 10px;
    border: 1px solid #000;
    height: 90%;
    background-size: 100% 100%;
  }

  .video:nth-child(1) {
    background: url(../../../assets/img/center-footer/1.jpg) repeat;
  }

  .video:nth-child(2) {
    background: url(../../../assets/img/center-footer/2.jpg) repeat;

  }

  .video:nth-child(3) {
    background: url(../../../assets/img/center-footer/3.jpg) repeat;

  }

  .video:nth-child(4) {
    background: url(../../../assets/img/center-footer/4.jpg) repeat;

  }
}
</style>
